<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:cote="http://java.sun.com/jsf/composite/componentes">

    <ui:composition template="/plantillas/plantillaPrincipal.xhtml">
        <ui:define name="contenido">
            <h:form id="formulario" enctype="multipart/form-data">
                <p:tabView id="tabFormulario" dynamic="true">

                    <p:tab id="tab1" title="#{BKCliente.comando.nombre eq 'Guardar'?'Registrar Cliente':'Actualizar Cliente'}">

                        <p:panel id="panel" header="#{BKCliente.comando.nombre eq 'Guardar'?'Registrar Cliente':'Actualizar Cliente'}">

                            <p:panelGrid style="margin: 10px auto;" id="formCliente">
                                <p:row>
                                    <p:column colspan="2">
                                        <center>
                                            <p:selectOneRadio id="idTipoCliente"    
                                                              value="#{BKCliente.clienteFormulario.tipoEntidad}">
                                                <f:selectItems value="#{BKCliente.listaTipoCliente}"
                                                               var="parametroDetalle" itemLabel="#{parametroDetalle.valCadena}"
                                                               itemValue="#{parametroDetalle}"  />
                                                <p:ajax event="valueChange"  update="pnlClienteNatural pnlClienteJuridico" listener="#{MBCliente.cambiarTipoCliente}" />
                                            </p:selectOneRadio>
                                        </center> 
                                        <p:message for="idTipoCliente" display="text"/>
                                    </p:column>
                                </p:row>   
                                <p:row>
                                    <p:column colspan="2">
                                        <p:outputPanel id="pnlClienteJuridico" layout="block" >
                                            <p:panelGrid rendered="#{BKCliente.clienteFormulario.tipoEntidad eq 'J' ? true : false}">
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioRuc"  value="#{message['cliente.formulario.panel.tab.cliente.ruc']}: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormularioRuc" required="true"
                                                                     value="#{BKCliente.clienteFormulario.numeroDocumento}" style="width: 350px"/>

                                                        <p:message for="txtFormularioRuc" display="text"/>
                                                        <span class="formatComment">Ejemplo: 201451455145</span>
                                                    </p:column>
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioNombreComercial" value="#{message['cliente.formulario.panel.tab.cliente.nombreComercial']}: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormularioNombreComercial" maxlength="100" 
                                                                     value="#{BKCliente.clienteFormulario.nombreComercial}" style="width: 350px"/>
                                                    </p:column>
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioRazonSocial" value="#{message['cliente.formulario.panel.tab.cliente.razonSocial']}: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormularioRazonSocial" maxlength="300" required="true"
                                                                     value="#{BKCliente.clienteFormulario.razonSocial}" style="width: 350px"/>
                                                        <p:message for="txtFormularioRazonSocial" display="text"/>
                                                    </p:column>
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioDireccionFiscal" value="#{message['cliente.formulario.panel.tab.cliente.direccionFiscal']}: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormularioDireccionFiscal" maxlength="300" required="true"
                                                                     value="#{BKCliente.clienteFormulario.direccionLegal}" style="width: 350px"/>
                                                        <p:message for="txtFormularioDireccionFiscal" display="text"/>
                                                    </p:column>
                                                </p:row>
                                            </p:panelGrid>
                                        </p:outputPanel>
                                        <p:outputPanel id="pnlClienteNatural" layout="block">
                                            <p:panelGrid rendered="#{BKCliente.clienteFormulario.tipoEntidad eq 'N' ? true :  false}">
                                                <p:row>
                                                    <p:column  style="width: 150px">
                                                        <h:outputText id="lblFormNaturalDni" value="DNI O RUC(*): " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputMask mask="99999999?999" id="txtFormNaturalDni" required="true" style="width: 350px"                                                      
                                                                     value="#{BKCliente.clienteFormulario.numeroDocumento}" />

                                                        <p:message for="txtFormNaturalDni" display="text"/>
                                                        <span class="formatComment">Ejemplo: 454745745</span>
                                                    </p:column>    
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormNaturalNombres" value="#{message['cliente.formulario.panel.tab.cliente.nombres']}: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormNaturalNombres" value="#{BKCliente.clienteFormulario.razonSocial}" 
                                                                     style="width: 350px" required="true" />
                                                        <p:message for="txtFormNaturalNombres" display="text"/>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormNaturalNombreComercial" maxlength="100" type="hidden"
                                                                     value="#{BKCliente.clienteFormulario.nombreComercial}" style="width: 350px"/>
                                                    </p:column>    
                                                </p:row>        
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormNaturalDireccion"  value="#{message['cliente.formulario.panel.tab.cliente.direccion']}: " styleClass="lblForm" />
                                                    </p:column>    
                                                    <p:column>    
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormNaturalDireccion"  value="#{BKCliente.clienteFormulario.direccionLegal}" 
                                                                     style="width: 350px" required="true" />
                                                        <p:message for="txtFormNaturalDireccion" display="text"/>
                                                    </p:column>
                                                </p:row>

                                            </p:panelGrid>
                                        </p:outputPanel>


                                        <p:outputPanel id="pnlUbigeo" layout="block">
                                            <p:panelGrid> 
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioTipoCliente" value="TIPO DE CLIENTE(*): " styleClass="lblForm"/>
                                                    </p:column>
                                                    <p:column>

                                                        <p:selectOneMenu id="cbxTipoCliente" required="true" style="width: 140px"
                                                                         value="#{BKCliente.clienteFormulario.tipoCliente}"> 
                                                            <f:selectItem itemLabel="Seleccionar" itemValue="" /> 
                                                            <f:selectItem itemLabel="LOCAL" itemValue="1"/>	
                                                            <f:selectItem itemLabel="EXTRANJERO" itemValue="2"/>
                                                        </p:selectOneMenu>

                                                        <p:message for="cbxTipoCliente" display="text"/>
                                                    </p:column>
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormularioCodigo" value="CODIGO(*): " styleClass="lblForm"/>
                                                    </p:column>
                                                    <p:column>
                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="txtFormClienteCodigo" value="#{BKCliente.clienteFormulario.codigoCliente}" 
                                                                     style="width: 50px" required="true" maxlength="3"/>

                                                        <p:message for="txtFormClienteCodigo" display="text"/>
                                                    </p:column>
                                                </p:row>
                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormClienteUbigeo" value="UBICACION(*): " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>

                                                        <p:inputText onkeyup="cambiarMayuscula(this)" id="idUbigeo" value="#{BKCliente.clienteFormulario.descUbicacion}" 
                                                                     style="width: 350px" required="true"/>
                                                        <p:commandButton value="CARGAR UBICACION" id="btnUbigeo" immediate="true"
                                                                         actionListener="#{MBUbigeo.inicializar}" process="@this" ajax="true"
                                                                         oncomplete="buscarUbigeo.show()" update=":formUbigeo:pnlUbigeo" >
                                                            <f:attribute name="update" value=":formulario:tabFormulario:idUbigeo" /> 
                                                            <f:attribute name="dialog" value="buscarUbigeo" /> 
                                                        </p:commandButton>
                                                        <p:message for="idUbigeo" display="text"/>


                                                    </p:column>
                                                </p:row>

                                                <p:row>
                                                    <p:column style="width: 150px">
                                                        <h:outputText id="lblFormClienteDocumento" value="DOCUMENTO: " styleClass="lblForm" />
                                                    </p:column>
                                                    <p:column>

                                                        <p:fileUpload fileUploadListener="#{MBCliente.handleFileUpload}"  
                                                                      mode="advanced" 
                                                                      update="messagesLogo"  
                                                                      auto="true"  
                                                                      sizeLimit="900000"   
                                                                      allowTypes="/(\.|\/)(gif|jpe?g|png)$/"/>
                                                        <p:growl id="messagesLogo" showDetail="true"/> 

                                                    </p:column>
                                                </p:row>
                                            </p:panelGrid>  
                                        </p:outputPanel>
                                    </p:column>
                                </p:row>
                            </p:panelGrid>    
                        </p:panel>


                    </p:tab>
                    <p:tab id="tabContactosCliente" title="Contactos" transient="true">
                        <cote:mantenimientoContacto id="mantenimientoContactoCliente" />
                    </p:tab>
                    <p:tab id="tabLocalesCliente" title="#{message['cliente.formulario.panel.tab.local.titulo']}" transient="true">
                        <cote:mantenimientoLocales id="mantenimientoLocal" 
                                                   accion="#{MBCliente.obtenerListaSedes()}" 
                                                   mantLocal="#{BKCliente.listaSedes}"/>
                    </p:tab>




                </p:tabView>   

                <h:panelGrid columns="2" cellpadding="10" >
                    <p:commandButton id="btnGuardar" action="#{BKCliente.comando.aceptar()}" ajax="false" 
                                     value="#{BKCliente.comando.nombre}"  />
                    <p:commandButton id="btnCancelar" action="#{MBCliente.cancelar()}" ajax="false" 
                                     immediate="true" value="Cancelar"/>
                </h:panelGrid>

                <h:panelGrid styleClass="mensaje_obligatorio">(*) Campos Requeridos</h:panelGrid>

            </h:form>  
            <p:dialog widgetVar="buscarUbigeo"  header="UBIGEO" modal="true" dynamic="true" >
                <ui:include src="../../../general/ubigeo1.xhtml" /> 
            </p:dialog>

            <p:dialog widgetVar="buscarUbigeoSede"  header="UBIGEO" modal="true" >
                <ui:include src="../../../general/ubigeo.xhtml" /> 
            </p:dialog>

        </ui:define>
    </ui:composition>
</html>
